<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
      <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=0.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="format-detection" content="telephone=no"/>
    <link href="/assets/src/css/cyb.css" type="text/css" rel="stylesheet"/>
    <link href="/assets/src/css/public.css" type="text/css" rel="stylesheet"/>
    <link href="/assets/css/nav.css" type="text/css" rel="stylesheet"/>
       <script type="text/javascript" src="/assets/js/jquery-1.8.1.min.js"></script>
       <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=134db1b9cf1f1f2b4427210932b34dcb"></script>
    <title>探索周边</title>
    <script type="text/javascript">
    function findDetail(oid){
    	window.location.href="/order/buy/success?oid="+oid;
    }
    
    </script>
  
</head>
<body>
<!--头部-->
<header class="product-hd hd-color"><a href="javascript:;" onclick="history.go(-1)" class="pre index-pre"></a>探索周边</header>
<nav class="index-nav clearfix"> 
  <a id="btnone" href="#" class="index-nav-border buttonColor" style="margin-left: 5px;">
  		<p>销售柜</p>
  </a> 
  <a id="btnsecond" href="#" class="index-nav-border">
  		<p>寄存柜</p>
  </a> 
</nav>

<article id="article">

<div style="margin-left: 43%;margin-top: 50px;">
<img src="/assets/images/loading.gif" style="height:50px;width:50px;">
<br>
正在加载...
<div>
<!--待付-->
<%-- <c:forEach var="myOrderList" items="${myOrder }" begin="0" varStatus="status">
	<div class="zone-01">
		<p class="zone-p1 clearfix">
			<c:if test="${myOrderList.isPay == 1 }">已付款</c:if>
			<c:if test="${myOrderList.isPay == 0 }">未付款</c:if>
			<input class="zone-cancle" value="订单详情" type="button" onclick="findDetail(${myOrderList.id })"/>
		</p>
		<p class="zone-p2 clearfix">${myOrderList.coName}<span class="zone-p2span">金额：${myOrderList.orderPrice }元</span></p>
		<p class="zone-p3 clearfix">订单号：${myOrderList.runNum }</p>
	</div>
</c:forEach> --%>
<!--列表-->

</article>
<!--底部-->
<%@ include file="../footer/footer.jsp"%>

<div id="allmap" style="display: none;width:1px;height: 1px;"></div>
<input type="hidden" id="lng" value=""/>
<input type="hidden" id="lat" value=""/>
</body>

<script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.331398,39.897445);
    map.centerAndZoom(point,12);

    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.panTo(r.point);
            $("#lng").val(r.point.lng);
            $("#lat").val(r.point.lat);
            var nearUrl = "/near/list";
            $.post(
            		nearUrl,
            		{lat:r.point.lat,lng:r.point.lng,cclass:1},
            		function(data){
            			//alert(data);
            			$("#article").html("");
            			for(var i=0;i<data.length;i++ ){
            				var cclass = "销售柜";
            				if(data[i].cClass == "2"){
            					cclass = "寄存柜";
            				}
            				$("#article").append("<div class='zone-01'>"+
            						"<p class='zone-p1 clearfix'>"+cclass+
            				"<input class='zone-cancle' value='立即使用' type='button' onclick='go("+data[i].cId+")'/>"+
            			"</p>"+
            			"<p class='zone-p2 clearfix'>"+data[i].cProvince+data[i].cCity+data[i].cArea.substring(0,8)+"</p>"+
            			"<p class='zone-p2 clearfix'><span class='zone-p2span'>距离您："+data[i].juli/1000+"km</span></p>"+
            		"</div>");
						}
            			
            		}
            );
            
           // alert('您的位置：'+r.point.lng+','+r.point.lat);
        }
        else {
            //alert('failed'+this.getStatus());
        }
    },{enableHighAccuracy: true})
    //关于状态码
    //BMAP_STATUS_SUCCESS	检索成功。对应数值“0”。
    //BMAP_STATUS_CITY_LIST	城市列表。对应数值“1”。
    //BMAP_STATUS_UNKNOWN_LOCATION	位置结果未知。对应数值“2”。
    //BMAP_STATUS_UNKNOWN_ROUTE	导航结果未知。对应数值“3”。
    //BMAP_STATUS_INVALID_KEY	非法密钥。对应数值“4”。
    //BMAP_STATUS_INVALID_REQUEST	非法请求。对应数值“5”。
    //BMAP_STATUS_PERMISSION_DENIED	没有权限。对应数值“6”。(自 1.1 新增)
    //BMAP_STATUS_SERVICE_UNAVAILABLE	服务不可用。对应数值“7”。(自 1.1 新增)
    //BMAP_STATUS_TIMEOUT	超时。对应数值“8”。(自 1.1 新增)
    
    
    $(document).ready(function(){
    	
    	$("#btnone").click(function(){
    		$("#btnone").addClass("buttonColor");
			$("#btnsecond").removeClass("buttonColor");
			clickEvent(1)
    	});
    	
    	

    	$("#btnsecond").click(function(){
    		$("#btnsecond").addClass("buttonColor");
			$("#btnone").removeClass("buttonColor");
			clickEvent(2)
    	});
    });
    
    
    function clickEvent(caclass){
    	var Lat = $("#lat").val();
    	var Lng = $("#lng").val();
    	 var nearUrl = "/near/list";
         $.post(
         		nearUrl,
         		{lat:Lat,lng:Lng,cclass:caclass},
         		function(data){
         			//alert(data);
         			$("#article").html("");
         			for(var i=0;i<data.length;i++ ){
         				var cclass = "销售柜";
         				if(data[i].cClass == "2"){
         					cclass = "寄存柜";
         				}
         				$("#article").append("<div class='zone-01'>"+
         						"<p class='zone-p1 clearfix'>"+cclass+
         				"<input class='zone-cancle' value='立即使用' type='button' onclick='go("+data[i].cId+")'/>"+
         			"</p>"+
         			"<p class='zone-p2 clearfix'>"+data[i].cProvince+data[i].cCity+data[i].cArea.substring(0,8)+"</p>"+
         			"<p class='zone-p2 clearfix'><span class='zone-p2span'>距离您："+data[i].juli/1000+"km</span></p>"+
         		"</div>");
						}
         			
         		}
         );
    }
    
    
    function go(cid){
    	window.location.href="/index/"+cid;
    }
</script>
</html>